<template>
  <div class='msg'>
    <div class='card'>
      <span class='card-o'></span>
      <span class='card-t'>基本信息</span>
    </div>
    <div class='userInfo'>
      <a-descriptions :column='1'>
        <a-descriptions-item label='账号'>
          {{ $store.state.user.info.username }}
        </a-descriptions-item>
        <a-descriptions-item label='用户名'>
          {{ $store.state.user.info.nickName }}
        </a-descriptions-item>
        <a-descriptions-item label='联系电话'>
          {{ $store.state.user.info.phone }}
        </a-descriptions-item>
      </a-descriptions>
    </div>
    <!--    <div class='card'>-->
    <!--      <span class='card-o'></span>-->
    <!--      <span class='card-t'>运维公司信息</span>-->
    <!--    </div>-->
    <!--    <div class='userInfo'>-->
    <!--      <a-descriptions :column='1'>-->
    <!--        <a-descriptions-item label="名称">-->
    <!--          Zhou Maomao-->
    <!--        </a-descriptions-item>-->
    <!--        <a-descriptions-item label="地址">-->
    <!--          1810000000-->
    <!--        </a-descriptions-item>-->
    <!--        <a-descriptions-item label="联系电话">-->
    <!--          Hangzhou, Zhejiang-->
    <!--        </a-descriptions-item>-->
    <!--      </a-descriptions>-->
    <!--    </div>-->
  </div>
</template>

<script>
export default {
  name: 'userMessage',
  data() {
    return {}
  },
  created() {

  },
  mounted() {
  },
  methods: {}
}
</script>

<style lang='less' scoped>
.msg {
  width: auto;
  height: auto;

  .card {
    .card-o {
      display: inline-block;
      width: 3px;
      height: 16px;
      background: #4470D8;
      border-radius: 0px 0px 0px 0px;
      margin-right: 10px;
      opacity: 1;
    }

    .card-t {
      font-size: 18px;
      font-family: Microsoft YaHei, Microsoft YaHei;
      font-weight: 400;
      color: #3D4149;
      line-height: 24px;
      -webkit-background-clip: text;
    }
  }

  .userInfo {
    margin-top: 20px;
    margin-left: 60px;
  }
}

</style>